<template>
  <Row class="data-dictionary" style="position: relative;">
    <Col span="4" class="col-height100" style="position: relative;" v-if="leftShow">
      <p style="text-align: center;border-bottom: 1px solid #EBEEF1;">
        <span>风险类型</span>
        <Icon
          type="ios-add-circle-outline"
          style="cursor: pointer;margin-left: 20px;color: #0099FF;font-size: 16px;font-weight: bold"
          @click="addOneBnt"
          v-if="typeaddBtnShow && isDispatch && personType===1"
        />
      </p>
      <div class="treeAuto">
        <Tree
          :data="treeList"
          ref="tree"
          :render="renderContent"
          style="padding-left:10px"
        ></Tree>
      </div>
      <img src="../../../assets/images/left.png" @click="leftShowBtn" class="imgShow"  alt="">
    </Col>
    <img src="../../../assets/images/right.png" v-if="!leftShow" @click="leftShowBtn" class="imgShow_1"  alt="">
    <Col :span="spanWidth" class="col-main">
      <Form label-position="top">
        <Row>
          <Col span="15">
            <Row>
              <Col span="8">
                <FormItem label style="margin-bottom: 14px;">
                  <Select
                    v-model="searchParams.riskCategoryId"
                    clearable
                    style="width: 90%;"
                    placeholder="请选择风险类别"
                  >
                    <Option
                      v-for="item in list"
                      :value="item.id"
                      :key="item.id"
                    >{{ item.riskCategoryName }}</Option
                    >
                  </Select>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem
                  label
                  style="margin-bottom: 14px;">
                  <Input style="width: auto;" v-model="searchParams.name" placeholder="请输入风险作业" clearable />
                </FormItem>
              </Col>
            </Row>
          </Col>
          <Col span="9" style="text-align: right;">
            <div class="button-s">
              <Button
                type="primary"
                style="margin-right: 15px"
                @click="searchBtn"
                v-if="searchBtnShow"
              >查询</Button
              >
              <!--<Button type="warning" @click="resetBtn">重置</Button>-->
            </div>
          </Col>
        </Row>
      </Form>
      <div class="button-s">
        <Button
          type="primary"
          v-if="stage !== 1 && addBtnShow && isDispatch && personType===1"
          @click="addBtn('add', '1', '风险信息新增')"
        >新增</Button
        >
        <Button type="primary"
                v-if="importBtnShow && isDispatch && personType===1"
                @click="addBtn('import', '1', '风险信息导入')"
        >导入</Button
        >
        <Button type="primary"  v-if="deleteBtnShow_s && isDispatch && personType===1" @click="deleteBtn">删除</Button>
      </div>
      <Table
        border
        ref="selection"
        :columns="columns"
        :data="dictList"
        @on-select="selectRiado"
        @on-select-all="selectRiadoAll"
        @on-select-cancel="selectCancel"
        @on-select-all-cancel="selectAllCancel"
      >
        <template slot-scope="{ row, index }" slot="action">
          <span
            title="编辑"
            class="button-class"
            type="text"
            v-if="editoBtnShow && isDispatch && personType===1"
            @click="addBtn('editor', row.id, '风险信息编辑', row.code)"
          >编辑</span
          >
          <span
            title="详情"
            class="button-class"
            type="text"
            v-if="detailBtnShow"
            @click="addBtn('details', row.id, '风险信息详情', row.code)"
          >详情</span
          >
          <span
            title="删除"
            class="button-class"
            type="text"
            v-if="deleteBtnShow && isDispatch && personType===1"
            @click="oneDeleteBtn(row)">删除</span>
        </template>
      </Table>
      <Page
        class="pagination"
        :page-size-opts="[10,20,50,100]"
        :total="page.total"
        :current="page.current"
        :page-size="page.pageSize"
        @on-change="pageChange"
        @on-page-size-change="sizeChange"
        show-elevator
        show-sizer
        show-total
      />
    </Col>
    <!--类型添加-->
    <Modal v-model="modalAdd" :mask-closable="false" :title="modalTitle">
      <Form
        ref="formData"
        :model="formData"
        :label-width="90"
        :show-message="false"
      >
        <FormItem :label="modalLabel" prop="name" :required="true">
          <Input
            v-model.trim="formData.name"
            placeholder="请输入类型名称"
            maxlength="60"
          ></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="text" size="large" @click="modalAdd = false">取消</Button>
        <Button type="primary" size="large" @click="saveItem(modalType)"
        >确认</Button
        >
      </div>
    </Modal>
    <!--导入-->
    <Modal v-model="modalImport" :mask-closable="false" title="导入">
      <Form
        ref="formData"
        :model="formData"
        label-position="top"
        :show-message="false"
      >
        <FormItem
          label="下载文件（为提高导入的成功率，请下载并使用系统提供的模板)"
          prop="name"
        >
          <Button type="primary" @click="downMb">下载模板</Button>
        </FormItem>
        <FormItem label="上传文件（仅支持xlsx,xls,文件大小<5M)" prop="name">
          <Poptip trigger="focus">
            <Upload
              action
              :show-upload-list="false"
              :before-upload="handleUpload"
            >
              <Input
                v-model="formData.fileName"
                prefix="ios-cloud-upload-outline"
                placeholder="上传文件"
                style="width: 200px"
                readonly
              />
              <Button type="primary" style="margin-left:20px;">选择文件</Button>
            </Upload>
          </Poptip>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="primary" size="large" :loading="loading" @click="saveImport()"
        >
          <span v-if="!loading">开始导入</span>
          <span v-else>正在导入中...</span>
        </Button>
      </div>
    </Modal>
    <!--修改后导入-->
    <Modal
      v-model="modalUpdateImport"
      :mask-closable="false"
      title="下面数据有误,导入未成功,请修改后[继续导入]:"
      width="95%"
    >
      <Table
        :columns="columns2"
        :data="updateImportList"
        border
        ref="selection"
      >
        <template slot-scope="{ row, index }" slot="select1">
          <Select
            class="width50"
            transfer
            :multiple="true"
            v-model.trim="row.riskCategoryNames"
            @on-change="changeBtn(1, row, index)"
            placeholder="请选择风险类别"
          >
            <Option
              v-for="item in list"
              :value="item.riskCategoryName"
              :key="item.id"
            >{{ item.riskCategoryName }}</Option
            >
          </Select>
        </template>
        <template slot-scope="{ row, index }" slot="select2">
          <Select
            class="width50"
            transfer
            v-model="row.riskLevel"
            @on-change="changeBtn(2, row, index)"
            placeholder="请选择作业分级"
          >
            <Option
              v-for="item in riskLevelList"
              :value="item.name"
              :key="item.id"
            >{{ item.name }}</Option
            >
          </Select>
        </template>
        <template slot-scope="{ row, index }" slot="select3">
          <Select
            class="width50"
            transfer
            v-model="row.classificationMethod"
            @on-change="changeBtn(3, row, index)"
            placeholder="请选择分级方法"
          >
            <Option
              v-for="item in classList"
              :value="item.classificationMethodName"
              :key="item.id"
            >{{ item.classificationMethodName }}</Option
            >
          </Select>
        </template>
      </Table>
      <div slot="footer">
        <Button type="text" size="large" @click="elseBtn"
        >忽略</Button
        >
        <Button type="primary" size="large" :loading="loading" @click="saveImport2()">
          <span v-if="!loading">修改后提交</span>
          <span v-else>正在提交中...</span>
        </Button>
      </div>
    </Modal>
  </Row>
</template>

<script>
  import apiUrl from "@/api/base";
  export default {
    name: 'risk-information-labrary',
    data() {
      return {
        leftShow:true,
        spanWidth:20,
        loading:false,
        isDispatch: false,//是否为调度港
        personType:JSON.parse(localStorage.getItem('personType')),
        typeaddBtnShow:false,
        typeeditoBtnShow:false,
        typedeleteBtnShow:false,
        addBtnShow:false,
        editoBtnShow:false,
        deleteBtnShow:false,
        deleteBtnShow_s:false,
        importBtnShow:false,
        detailBtnShow:false,
        modalAdd: false,
        modalImport: false,
        modalUpdateImport: false,
        searchBtnShow: false,
        modalTitle: '添加',
        modalLabel: '一级类型',
        modalType: 'add',
        stage: 1,
        formData: {
          name: '',
          parentId: '0',
          fileName: '',
          file: null
        },
        searchParams: {
          riskCategoryId: '',
          name: ''
        },
        list: [],
        list1: [],
        engineeringTypeList: [],
        parentId: '0',
        typeCode: '',
        deleteList: [],
        columns: [
          {
            type: 'selection',
            width: 60,
            align: 'center'
          },
          {
            title: '序号',
            align: 'center',
            width: 70,
            render: (h, params) => {
              return h(
                'span',
                params.index + (this.page.current - 1) * this.page.pageSize + 1
              )
            }
          },
          {
            title: '风险作业',
            key: 'name',
            align: 'center'
          },
          {
            title: '风险类别',
            key: 'riskCategoryNames',
            align: 'center',
            width: 300
          },
          {
            title: '操作',
            width: 180,
            align: 'center',
            slot: 'action'
          }
        ],
        dictList: [],
        typeList: [],
        treeList: [],
        updateImportList: [],
        classList: [],
        riskLevelList: [
          { id: '1', name: 'Ⅰ级' },
          { id: '2', name: 'Ⅱ级' },
          { id: '3', name: 'Ⅲ级' },
          { id: '4', name: 'Ⅳ级' }
        ],
        columns2: [
          /*{
              type: "selection",
              width: 60,
              align: "center",
            },*/
          {
            title: "序号",
            type: "index",
            align: "center",
            width: 70
          },
          {
            title: '*一级类型',
            key: 'node1',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.node1
                },
                attrs: {
                  title: params.row.node1
                },
                on: {
                  'on-change'(event) {
                    params.row.node1 = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '二级类型',
            key: 'node2',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.node2
                },
                attrs: {
                  title: params.row.node2
                },
                on: {
                  'on-change'(event) {
                    params.row.node2 = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '三级类型',
            key: 'node3',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.node3
                },
                attrs: {
                  title: params.row.node3
                },
                on: {
                  'on-change'(event) {
                    params.row.node3 = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '四级类型',
            key: 'node4',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.node4
                },
                attrs: {
                  title: params.row.node4
                },
                on: {
                  'on-change'(event) {
                    params.row.node4 = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '五级类型',
            key: 'node5',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.node5
                },
                attrs: {
                  title: params.row.node5
                },
                on: {
                  'on-change'(event) {
                    params.row.node5 = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '风险作业',
            key: 'riskName',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.riskName
                },
                attrs: {
                  title: params.row.riskName
                },
                on: {
                  'on-change'(event) {
                    params.row.name = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '风险类别',
            key: 'riskCategoryNames',
            align: 'center',
            slot: 'select1',
            width: 150
          },
          {
            title: '作业分级',
            key: 'riskLevel',
            align: 'center',
            slot: 'select2'
          },
          {
            title: '分级方法',
            key: 'classificationMethod',
            align: 'center',
            slot: 'select3'
          },
          {
            title: '来源',
            key: 'origin',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.origin
                },
                attrs: {
                  title: params.row.origin
                },
                on: {
                  'on-change'(event) {
                    params.row.origin = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },{
            title: '具体描述',
            key: 'riskDescription',
            align: 'center',
            render: (h, params) => {
              var vm = this
              return h('Input', {
                props: {
                  value: params.row.riskDescription
                },
                attrs: {
                  title: params.row.riskDescription
                },
                on: {
                  'on-change'(event) {
                    params.row.riskDescription = event.target.value
                    vm.updateImportList[params.index] = params.row
                  }
                }
              })
            }
          },
          {
            title: '失败原因',
            key: 'errorMsg',
            align: 'center',
            render: (h, params) => {
              return h('span',{
                style:{
                  color:"#f00"
                }
              },params.row.errorMsg)
            }
          }
        ],
        treeNode:'',
        changeDataList: [],
        page: {
          total: 0,
          current: 1,
          pageSize: 10,
          totalPage: 0
        }
      }
    },
    methods: {
      //查询当前用户是否为调度员
      checkPerson(){
        this.$api.measurePlan.checkDispatch().then(res => {
          if(res.code === 200){
            this.isDispatch = true;
          } else {
            this.isDispatch = false;
          }
        })
      },
      addBtn(type, id, name, code) {
        if (type === 'import') {
          this.modalImport = true;
          this.formData.fileName= '';
          this.formData.file = null;
        } else if(type === 'add'){
          if (!this.formData.parentId) {
            this.$Message.warning('请先选择风险类型')
            return
          }
          this.$router.push({
            //path: `risk-information-labrary/${type}/${id}/${name}`,
            name:'risk-information-add',
            params:{type,id,name,parentId: this.formData.parentId},
          })
        }else if(type === 'editor'){
          this.$router.push({
            name:'risk-information-edit',
            params:{type,id,name},
            query: {
              parentId: this.formData.parentId
            }
          })
        }else if(type === 'details'){
          this.$router.push({
            name:'risk-information-detail',
            params:{type,id,name},
            query: {
              parentId: this.formData.parentId
            }
          })
        }
      },
      //.......树..开始
      renderContent(h, { root, node, data }) {
        return h(
          'span',
          {
            style: {
              display: 'inline-block',
              width: '100%'
            },
            class: 'tree_box'
          },
          [
            h('span', [
              /*h('Icon', {
                props: {
                  type: 'ios-paper-outline'
                },
                style: {
                  marginRight: '8px'
                }
              }),*/
              h('span', {
                domProps: {
                  innerHTML: data.name
                },
                style: {
                  cursor: 'pointer',
                  color: node.node.selected ? '#2d8cf0' : '#333' //根据选中状态设置样式
                },
                on: {
                  click: () => {
                    this.selectChange(node, data)
                    if (!node.node.selected)
                      this.$refs.tree.handleSelect(node.nodeKey) //手动选择树节点
                  }
                }
              })
            ]),
            h(
              'span',
              {
                style: {
                  display: 'inline-block',
                  /*float: 'right',*/
                  marginLeft: '20px'
                }
              },
              [
                data.stage !== 2 && data.level != 5 && this.typeaddBtnShow && this.isDispatch  && this.personType===1
                  ? h('Icon', {
                    props: Object.assign({}, this.buttonProps, {
                      type: 'ios-add-circle-outline'
                    }),
                    style: {
                      marginRight: '8px',
                      color: '#0099FF',
                      cursor: 'pointer',
                      fontWeight: 'bold'
                    },
                    attrs: {
                      title: '添加'
                    },
                    on: {
                      click: () => {
                        this.append(data)
                      }
                    }
                  })
                  : h(),
                this.typeeditoBtnShow && this.isDispatch && this.personType===1?h('Icon', {
                  props: Object.assign({}, this.buttonProps, {
                    type: 'ios-create-outline'
                  }),
                  style: {
                    marginRight: '8px',
                    color: '#0099FF',
                    cursor: 'pointer',
                    fontWeight: 'bold'
                  },
                  attrs: {
                    title: '编辑'
                  },
                  on: {
                    click: () => {
                      this.editBtn(data)
                    }
                  }
                }): h(),
                data.stage === 0 && this.typedeleteBtnShow && this.isDispatch && this.personType===1?h('Icon', {
                  props: Object.assign({}, this.buttonProps, {
                    type: 'ios-trash-outline'
                  }),
                  style: {
                    color: '#0099FF',
                    cursor: 'pointer',
                    fontWeight: 'bold'
                  },
                  attrs: {
                    title: '删除'
                  },
                  on: {
                    click: () => {
                      this.remove(root, node, data)
                    }
                  }
                }):h(),
              ]
            )
          ]
        )
      },
      append(data) {
        this.treeNode = data;
        this.modalTitle = '添加';
        this.formData.name = ''
        this.formData.parentId = data.id
        if (data.level === 1) {
          this.modalLabel = '二级类型'
        } else if (data.level === 2) {
          this.modalLabel = '三级类型'
        } else if (data.level === 3) {
          this.modalLabel = '四级类型'
        }else if (data.level === 4) {
          this.modalLabel = '五级类型'
        }
        this.modalType = 'add'
        this.modalAdd = true
      },
      editBtn(data) {
        this.treeNode = data;
        this.modalTitle = '编辑'
        if (data.level === 2) {
          this.modalLabel = '二级类型'
        } else if (data.level === 3) {
          this.modalLabel = '三级类型'
        } else if (data.level === 4) {
          this.modalLabel = '四级类型'
        }else if (data.level === 5) {
          this.modalLabel = '五级类型'
        }
        this.modalType = 'edit'
        this.modalAdd = true
        this.formData.name = data.name
        this.formData.parentId = data.id
      },
      remove(root, node, data) {
        console.log('root',root);
        console.log('node',node);
        console.log('data',data);
        this.$Modal.confirm({
          title: '温馨提示',
          content: '<p>确认删除吗？</p>',
          okText: '确定',
          cancelText: '取消',
          onOk: () => {
            this.$api.measuresLibrary.getriskInfoLibdeleteRiskType(data.id).then(res => {
              if (res.code === 200) {
                this.$Message.success(res.message)
                if(node.parent){
                  const parentKey = root.find(el => el === node).parent;
                  const parent = root.find(el => el.nodeKey === parentKey).node;//父节点
                  const index = parent.children.indexOf(data);
                  parent.children.splice(index, 1);
                  if(res.data){
                    parent.stage = res.data.stage
                  }
                }else {
                  this.treeList.forEach((val,index) => {
                    if(val.id === data.id){
                      this.treeList.splice(index,1)
                    }
                  })
                }
              } else {
                this.$Message.error(res.message)
              }
            })
          }
        })
      },
      //点击树节点
      selectChange(e, d) {
        this.treeNode = d;
        this.deleteList = []
        this.formData.parentId = d.id
        this.stage = d.stage
        this.searchParams.riskCategoryId = '';
        this.searchParams.name = '';
        this.getWbsTabelList()
      },
      addOneBnt() {
        //添加一级
        this.treeNode='';
        this.modalType = 'add'
        this.modalAdd = true
        this.modalTitle = '添加'
        this.modalLabel = '一级类型'
        this.formData.parentId = '0'
        this.formData.name = ''
      },
      getQueryRiskTypeTree() {
        //树
        this.$api.measuresLibrary.getQueryRiskTypeTree().then(res => {
          if (res.code == 200) {
            res.data.map(r => {
              this.$set(r, 'title', r.name)
              this.$set(r, 'expand', false)
            })
            this.treeList = res.data
          } else {
            this.$Message.error(res.data.message)
          }
        })
      },
      saveItem(type) {
        //风险类型--添加
        if (!this.formData.name) {
          this.$Message.warning('名称不能为空')
          return
        }
        let prames = {
          name: this.formData.name
        }
        if (type === 'add') {
          prames.parentId = this.formData.parentId
          this.$api.measuresLibrary.getAddRiskType(prames).then(res => {
            if (res.code === 200) {
              this.modalAdd = false
              this.$Message.success(res.message);
              this.$set(res.data, 'title', res.data.name);
              this.$set(res.data, 'expand', true);
              if(this.treeNode){
                this.$set(this.treeNode, 'stage', 6);
                this.$set(this.treeNode, 'expand', true);
                const children = this.treeNode.children || [];
                children.push(res.data);
                this.$set(this.treeNode, 'children', children);
              }else {
                this.treeList.push(res.data)
              }
            } else {
              this.$Message.error(res.message)
            }
          })
        } else {
          prames.id = this.formData.parentId
          this.$api.measuresLibrary.getUpdateRiskType(prames).then(res => {
            if (res.code === 200) {
              this.modalAdd = false
              this.$Message.success(res.message);
              this.treeNode.name = res.data.name
            } else {
              this.$Message.error(res.message)
            }
          })
        }
      },
      //..........树...结束
      //批量删除
      deleteBtn() {
        if (this.deleteList.length <= 0) {
          this.$Message.warning('请选择要删除的数据')
          return false
        }
        const deleteList = []
        this.deleteList.forEach(val => {
          deleteList.push(val.id)
        })
        this.$Modal.confirm({
          title: '温馨提示',
          closable: true,
          content: '确认删除吗？',
          width: 360,
          onOk: () => {
            this.$api.measuresLibrary
              .getriskInfoLibbatchDelete(deleteList)
              .then(res => {
                if (res.code === 200) {
                  this.$Message.success(res.message)
                  this.deleteList = [];
                  var vm = this;
                  if(res.data){
                    vm.treeNode.stage = res.data.stage;
                  }
                  this.getWbsTabelList(this.parentId)
                } else {
                  this.$Message.error(res.message)
                }
              })
          }
        })
      },
      //单删除
      oneDeleteBtn(row){
        this.$Modal.confirm({
          title: '温馨提示',
          closable: true,
          content: '确认删除吗？',
          width: 360,
          onOk: () => {
            this.$api.measuresLibrary.getriskInfoLibDelete(row.id).then(res => {
              if (res.code === 200) {
                var vm = this
                this.$Message.success(res.message)
                if(res.data){
                  vm.treeNode.stage = res.data.stage;
                }
                this.getWbsTabelList(this.parentId)
              } else {
                this.$Message.error(res.message)
              }
            })
          }
        })
      },
      //导入
      downMb() {
        // 下载模板
        window.open('http://211.159.175.34/model/风险作业导入模板.xlsx')
      },
      handleUpload(file) {
        this.formData.file = file
        this.formData.fileName = file.name
        return false
      },
      saveImport() {
        if (this.formData.file != null) {
          let type = this.formData.file.name.slice(this.formData.file.name.lastIndexOf("."));
          let size = this.formData.file.size / 1024 / 1024;
          if(size > 5){
            this.$Message.warning("文件不能大于5M");
            return
          }
          let formData = new FormData()
          formData.append('file', this.formData.file)
          if(type === '.xlsx' || type === '.xls'){
            this.loading = true;
            this.$api.measuresLibrary
              .getriskInfoLibimportExcel(formData)
              .then(res => {
                if (res.code == 200) {
                  this.loading = false;
                  this.formData.file = null
                  this.modalImport = false
                  this.$Message.success(res.message)
                  this.getQueryRiskTypeTree()
                } else if (res.code === 201) {
                  this.loading = false;
                  this.$Message.warning(res.message)
                  this.modalUpdateImport = true
                  this.updateImportList = res.data
                  this.getRiskOperationClassificationMethod()
                } else {
                  this.loading = false;
                  this.$Message.warning(res.message)
                }
              })
          }else {
            this.$Message.warning('请上传指定的格式');
          }
        } else {
          this.$Message.warning('请选择要上传的文件')
        }
      },
      saveImport2() {
        this.updateImportList.forEach(item => {
          if (Array.isArray(item.riskCategoryNames))
            item.riskCategoryNames = item.riskCategoryNames.toString()
        })
        this.loading = true;
        this.$api.measuresLibrary
          .getriskInfoLibupdateImport(this.updateImportList)
          .then(res => {
            if (res.code == 200) {
              this.loading = false;
              this.formData.file = null
              this.modalImport = false
              this.modalUpdateImport = false
              this.$Message.success(res.message)
              this.getQueryRiskTypeTree()
            } else if (res.code === 201) {
              this.loading = false;
              this.$Message.warning(res.message)
              this.modalUpdateImport = true
              this.updateImportList = res.data
              this.getRiskOperationClassificationMethod()
            } else {
              this.loading = false;
              this.$Message.warning(res.message)
            }
          })
      },
      elseBtn(){
        this.modalUpdateImport = false;
        this.modalImport = false;
        this.getQueryRiskTypeTree()
      },
      changeBtn(type, row, num) {
        //console.log(row,index);
        this.updateImportList.map((item, index) => {
          if (index === num)
            if (type === 1) {
              item.riskCategoryNames = row.riskCategoryNames
            } else if (type === 2) {
              item.riskLevel = row.riskLevel
            } else {
              item.classificationMethod = row.classificationMethod
            }
        })
      },
      //风险类别
      getRiskCategoryFindAll() {
        this.$api.measuresLibrary.getRiskCategoryFindAll().then(res => {
          if (res.code == 200) {
            this.list = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //列表
      getWbsTabelList(id) {
        let res = {
          currentPage: this.page.current,
          pageSize: this.page.pageSize,
          whereMap: {
            parentId: this.formData.parentId, //"父节点ID",
            riskCategoryId: this.searchParams.riskCategoryId, //"风险类别",
            name: this.searchParams.name //"风险作业名称"
          }
        }
        this.$api.measuresLibrary.getRiskInfoLibPageList(res).then(res => {
          if (res.code === 200) {
            this.dictList = res.data.resultObject
            this.dictList.forEach(val => {
              val.riskCategoryNames = []
              val.riskCategoryIds.split(',').forEach(value => {
                this.list.forEach(item => {
                  if (value === item.id) {
                    val.riskCategoryNames.push(item.riskCategoryName)
                  }
                })
              })
              val.riskCategoryNames = val.riskCategoryNames.toString()
            })
            this.page.total = res.data.totalRecord
            this.page.totalPage = res.data.totalPage
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //分级方法
      getRiskOperationClassificationMethod() {
        this.$api.measuresLibrary
          .getRiskOperationClassificationMethod()
          .then(res => {
            if (res.code === 200) {
              this.classList = res.data
            } else {
              this.$Message.error(res.message)
            }
          })
      },
      //按钮显示
      buttonShow() {
        let buttonList = JSON.parse(localStorage.getItem('buttonList'))
        buttonList.map(val => {
          let key = Object.keys(val).toString();
          if (key === this.$route.name) {
            Object.values(val)[0].map(item => {
              if (item.code === 'P_0601_04') {
                this.addBtnShow = true
              } else if (item.code === 'P_0601_08') {
                this.editoBtnShow = true
              } else if (item.code === 'P_0601_10') {
                this.deleteBtnShow = true
              }else if (item.code === 'P_0601_03') {
                this.typedeleteBtnShow = true
              }else if (item.code === 'P_0601_02') {
                this.typeeditoBtnShow = true
              }else if (item.code === 'P_0601_01') {
                this.typeaddBtnShow = true
              }else if (item.code === 'P_0601_06') {
                this.deleteBtnShow_s = true
              }else if (item.code === 'P_0601_05') {
                this.importBtnShow = true
              }else if (item.code === 'P_0601_09') {
                this.detailBtnShow = true
              }else if (item.code === 'P_0601_07') {
                this.searchBtnShow = true
              }
            })
          }
        })
      },
      leftShowBtn(){
        this.leftShow = !this.leftShow ;
        this.leftShow?this.spanWidth=20:this.spanWidth=24;
      },
      //搜索
      searchBtn() {
        this.formData.parentId = '0';
        this.getWbsTabelList();
        this.getQueryRiskTypeTree();
      },
      //重置
      resetBtn() {
        this.searchParams.riskCategoryId = ''
        this.searchParams.name = ''
        this.getWbsTabelList()
      },
      //全选
      selectRiadoAll(e) {
        this.deleteList = e
      },
      //全选取消
      selectAllCancel() {
        this.deleteList = []
      },
      //单选
      selectRiado(e) {
        this.deleteList = e
      },
      //取消某一项
      selectCancel(e) {
        this.deleteList.splice(e, 1)
      },
      pageChange(current) {
        this.page.current = current
        this.getWbsTabelList(this.parentId)
      },
      sizeChange(size) {
        this.page.current = 1
        this.page.pageSize = size
        this.getWbsTabelList(this.parentId)
      }
    },
    /*watch: {
      $route(to, from) {
        const fromUrl = from.path
        const toUrl = to.path
        if (fromUrl.indexOf(toUrl) > -1) {
          /!*if (fromUrl.indexOf("add") > -1 || fromUrl.indexOf("import") > -1) {
              if (localStorage.getItem("page")) {
                this.getWbsList(this.searchParams.dictEngineeringType);
              }
            }*!/
          if (fromUrl.indexOf('editor') > -1 || fromUrl.indexOf('add') > -1) {
            if (localStorage.getItem('page')) {
              let page = JSON.parse(localStorage.getItem('page'))
              this.page.current = page.current
              this.page.pageSize = page.pageSize
              this.getWbsTabelList()
            }
          }
        }
        localStorage.setItem('page', '')
      }
    },*/
    mounted() {
      this.checkPerson()
      this.getQueryRiskTypeTree()
      this.getRiskCategoryFindAll()
      this.buttonShow()
      this.getWbsTabelList()
    },
    activated() {
      this.getWbsTabelList()
    }
  }
</script>

<style lang="scss" scoped>
  .data-dictionary {
    height: calc(100% - 0px);
    .col-height100 {
      height: 100%;
      border-right: 1px solid #ebeef1;
      //overflow: auto;
      p {
        padding: 10px;
      }
      .treeAuto{
        height: calc(100% - 40px);
        overflow: auto;
      }
    }
    .col-main {
      padding: 10px;
      .button-s {
        margin-bottom: 15px;
        button {
          margin-right: 15px;
        }
      }
    }
    .tabs_box {
      color: #f00 !important;
    }
    .imgShow,.imgShow_1{
      position: absolute;
      right: 0;
      top: 50%;
      cursor: pointer;
      z-index: 11;
    }
    .imgShow_1{
      left: 0;
    }
  }
</style>
